<div class="p-4 w-full md:w-1/2 lg:w-1/3">
  <div
    class="bg-card text-card-foreground border-border border w-full h-full rounded-lg px-3 py-6 text-center"
  >
    <h3 class="text-3xl font-bold flex flex-col items-center mb-4">
      <Astro.props.icon class="w-10 h-10 lg:w-12 lg:h-12 text-primary" />
      <span class="mt-2">{Astro.props.title}</span>
    </h3>
    <p class="text-muted-foreground">{Astro.props.description}</p>
  </div>
</div>
